{% extends "PopshouseAdminBundle::layout.html.twig" %}

{% block title %}
Nieuws & Promotionele berichten - sorteren
{% endblock %}
{% block content %}
<div class="left side">
    {% include "PopshouseAdminBundle:News:menu.html.twig"  %}
</div>
<div class="left content" style="width:670px">

<h2>Nieuws sorteren</h2>



<img src="{{ asset('images/layout/loader.gif') }}" id="loader" style="display:none;" />

<div class="flash-notice" style="display:none;"></div>

<ol id="sortable">


   {% for entry in news %}
   
   
    <li id="entry_{{entry.id}}" style="background-color: #e4edf5; margin-bottom:5px;">
       <span class="ui-icon ui-icon-arrowthick-2-n-s" style="float:left;"></span>
       <img class="bg" src="{{ asset('images/photo/news/' ~ entry.id ~ 't.jpg') }}" />
       {{ ("title."~entry.id) | trans({},"images") | raw }}
    </li>
    {% endfor %}


</ol>

<form id="sort" name="sort" enctype="application/x-www-form-urlencoded" method="post" action="#">
    <dl>
        <dt id="order-label">&nbsp;</dt>
        <dd id="order-element">
            <input type="hidden" name="order" value="" id="order" />
        </dd>
        <dt id="submit-label">&nbsp;</dt>
        <dd id="submit-element">
            <input type="submit" name="submit" id="submit" value="Opslaan" disabled="1" />
        </dd>
    </dl>
</form>
</div>


{% endblock %}
{% block js %}

  
        $("#sortable").sortable({
            change: function(){$("#submit").removeAttr("disabled");$(".flash-notice").fadeOut("normal");},
            stop: function(){
                $("#order").val($(this).sortable('serialize'));
            }
        });
        
        $("#sortable").disableSelection();
        var options = { 
            target:     '.success',
            dataType: 'json',
            format: 'json',
            beforeSubmit : function(){ $(".flash-notice").hide(); $("#loader").show(); },
            success:    function(data, textStatus) { 
                $("#loader").hide();
                $("#submit").attr("disabled","1");
                $(".flash-notice").html(data["message"]);
                $(".flash-notice").fadeIn("slow");
            },
            error:    function(data, textStatus) { 
                $("#loader").css("visibility","hidden");
                alert("Fout tijdens het opslaan");
                $.debug.print_r(data, "debug"); 
            } 
        }; 
        $('#sort').ajaxForm(options);
{% endblock %}